<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="./src/vue.js"></script>

</head>
<body>

<div id="app">

    <!--
        条件判断
            v-if
            语法:v-if= "表达式"
            通过v-if的那个div已经在dom中移除了
            v-show
            语法:v-show= "表达式"
            而v-show的div则是通过display：none来达到隐藏。但dom结构依然存在

    -->

    <div v-if="showOrhide">显示或隐藏1</div>
    <div v-show="showOrhide">显示或隐藏2</div>
</div>




<script>

    new Vue({
        el: '#app',
        data:{
            showOrhide:false
        }

    })

</script>




</body>
</html>